検証: Scrapboxのテロメアの増やし方・減らし方
from テロメアの幅をカスタマイズするUserCSS
実際にいじってみた結果、「更新から1週間ちょい経った行のみ特に目立たせる」(cssだと5pxに割り当てられている時間帯のみ)と色、太さ以外の情報を持ってしまい返ってわかりにくくなった
結局、5px以上は今の太さプラス5pxとして、4px以下はそのままにしておくことで納得した
デフォルト: 10px, 9px, 8px, 7px, 6px, 5px, 4px, 3px, 2px, 1px
変更後: 15px, 14px, 13px, 12px, 11px, 10px, 4px, 3px, 2px, 1px
code:style.css
/* 元々10px, 編集したて */
.line .telomere .telomere-border.telomere-borderstyle*="10px" {
border-width: 0px 0px 0px 15px !important;
}
/* 元々9px, 最終更新: 1～2時間前で確認 */
.line .telomere .telomere-border.telomere-borderstyle*="9px" {
border-width: 0px 0px 0px 14px !important;
}
/* 元々8px, 最終更新: 7時間前で確認 */
.line .telomere .telomere-border.telomere-borderstyle*="8px" {
border-width: 0px 0px 0px 13px !important;
}
/* 元々7px, 最終更新: 1～2日前で確認 */
.line .telomere .telomere-border.telomere-borderstyle*="7px" {
border-width: 0px 0px 0px 12px !important;
}
/* 元々6px, 最終更新: 2～6日前くらいで確認 */
.line .telomere .telomere-border.telomere-borderstyle*="6px" {
border-width: 0px 0px 0px 11px !important;
}
/* 元々5px, 最終更新: 7～9日前くらいで確認 */
.line .telomere .telomere-border.telomere-borderstyle*="5px" {
border-width: 0px 0px 0px 10px !important;
}
/* 元々4px, 最終更新: 20～30日前くらいで確認 */
.line .telomere .telomere-border.telomere-borderstyle*="4px" {
border-width: 0px 0px 0px 4px !important;
}
.line .telomere .telomere-border.telomere-borderstyle*="3px" {
border-width: 0px 0px 0px 3px !important;
}
.line .telomere .telomere-border.telomere-borderstyle*="2px" {
border-width: 0px 0px 0px 2px !important;
}
.line .telomere .telomere-border.telomere-borderstyle*="1px" {
border-width: 0px 0px 0px 1px !important;
}
code:style2.css
:root {
--telomer-1-color: #4ebc65;
--telomer-2-color: #65c378;
--telomer-3-color: #7cc98c;
--telomer-4-color: #93d0a0;
--telomer-5-color: #aad7b4;
--telomer-6-color: #c1dec7;
--telomer-7-color: #d8e5db;
}
/* 直近 */
.telomere-borderstyle*="10px" {
border-width: 0px 0px 0px 15px !important;
}
/* 最終更新: 1～2時間前で確認 */
.telomere-borderstyle*="9px" {
border-width: 0px 0px 0px 14px !important;
}
/* 最終更新: 7時間前で確認 */
.telomere-borderstyle*="8px" {
border-width: 0px 0px 0px 13px !important;
}
/* 最終更新: 1～2日前で確認 */
.telomere-borderstyle*="7px" {
border-width: 0px 0px 0px 12px !important;
border-color: var(--telomer-1-color) !important;
}
/* 最終更新: 2～6日前くらいで確認 */
.telomere-borderstyle*="6px" {
border-width: 0px 0px 0px 11px !important;
border-color: var(--telomer-2-color) !important;
}
/* 最終更新: 7～9日前くらいで確認 */
.telomere-borderstyle*="5px" {
border-width: 0px 0px 0px 10px !important;
border-color: var(--telomer-3-color) !important;
}
/* 最終更新: 20～30日前くらいで確認 */
.telomere-borderstyle*="4px" {
border-width: 0px 0px 0px 4px !important;
}
.telomere-borderstyle*="3px" {
border-width: 0px 0px 0px 3px !important;
}
.telomere-borderstyle*="2px" {
border-width: 0px 0px 0px 2px !important;
}
.telomere-borderstyle*="1px" {
border-width: 0px 0px 0px 1px !important;
}